<template>
  <div class="c-bg-sgray">
    <audio id="audio" @ended="playAudioEnd" class="c-pf c-p-l-100"></audio>
    <div class="c-p c-pt40 c-ph24 theme-bg-gradient18050">
      <img class="c-pa c-p-t0 c-p-l0" :src="require('@/assets/i/wap/clockIn/ranklist_bg.png')" alt="">
      <div class="c-flex-row c-aligni-center c-p">
        <img class="c-ww120 c-hh120 c-brp50 top-header" :src="$addXossFilter(userInfo.headimgurl, require('@/assets/defult_head.png'))" alt="">
        <div class="c-fc-xblack c-flex-row c-aligni-center c-ml20 c-flex-grow1 c-justify-sb" @click="ediNinameShow">
          <div class="c-fs28 c-fc-xblack c-fw600">{{userInfo.nickname}}</div>
          <i class="iconfont c-fs28 c-ml10" v-if="userInfo.myUserId==userInfo.userId">&#xe90e;</i>
        </div>
      </div>
      <div class="c-bg-white c-flex-row c-pv40 c-justify-sa c-br20 c-mt40 c-p">
        <div class="c-flex-grow1 c-textAlign-c">
          <div class="c-fs36 c-fw600 c-fc-xblack">{{userInfo.finishNum}}</div>
          <div class="c-fs22 c-fc-gray c-pt12">{{userInfo.type == 1 ? '打卡':userInfo.type == 2 ? '作业':'课时'}}</div>
        </div>
        <div class="c-flex-grow1 c-textAlign-c">
          <div class="c-fs36 c-fw600 c-fc-xblack">{{userInfo.zanNum}}</div>
          <div class="c-fs22 c-fc-gray c-pt12">获赞</div>
        </div>
        <div class="c-flex-grow1 c-textAlign-c">
          <div class="c-fs36 c-fw600 c-fc-xblack">{{userInfo.score}}</div>
          <div class="c-fs22 c-fc-gray c-pt12">评分</div>
        </div>
      </div>
    </div>
    <div class="c-fc-xblack c-fs28 c-fw600 c-ml24 c-mt30 c-p">{{userInfo.type == 1 ? '打卡': userInfo.type == 2 ? '作业':'课时'}}记录</div>
    <div class="c-ph24 c-pb20 c-p">
      <div class="c-bg-white c-p c-br20 c-mt20 c-pt30 c-pb36 c-pb24" v-for="(item,index) in studyList" :key="index" @click.stop="goStuAnswerResult(item)">
        <i v-if="item.examType == 3" class="iconfont c-pa c-p-t0 c-fs c-p-r24 c-fs24 c-p-r100 c-fc-green">&#xe829;</i>
        <div v-if="item.enableShow==0&&isDisCheat==2" class="c-fs48 theme-fc iconfont icon-biaoqianx c-pa onlyIcon">
          <div class="c-fc-white c-fs18 c-pa c-p-t5 c-p-l20">仅老师可见</div>
        </div>
        <!-- <span v-if="item.type == 3 && item.aiNum > 1" @click="showAiAnswerContent(item)" class="box-analyze theme-bg-10 c-pa c-p-t4 c-p-r0 c-flex-row c-flex-center c-ww88 c-fs18 theme-fc">详情<i class="iconfont c-fs12 theme-fc">&#xe60e;</i></span> -->
        <div class="c-flex-row c-aligni-center c-justify-sb">
          <div>
            <div class="c-fs22 c-ph20 c-pb20">
              <span class="type-bg theme-fc theme-bg-10">{{typeQueMap[item.type]}}</span>
              <span>{{userInfo.type == 1 ? `第${item.name}天`:userInfo.type == 2 ? item.name : `第${item.reorder}课时`}}</span>
            </div>
            <div class="c-flex-row c-aligni-center" v-if="(item.type == 1||item.type == 4) && item.rank !== null&& item.rank!=0">
              <div class="c-flex-row c-aligni-center c-ph20">
                <img v-for="index in 5" :key="index" class="c-ww24 c-hh24 c-mr4" :src="index <= item.rank ? require('@/assets/i/wap/clockIn/star_s.png'): require('@/assets/i/wap/clockIn/star_d.png')" alt="" />
              </div>
              <div class="c-fs24 theme-fc">{{item.rank * 20}}</div>
            </div>
          </div>
          <i class="iconfont c-fc-gray c-pr24 c-fs32" v-if="(userInfo.myUserId==item.userId)&&((item.isDisAgainSign)||(item.isAnalyze && item.type == 1)||item.enableDelete)" @click.stop="calcOperation(item,index)">&#xe7be;</i>
        </div>
        <clock-aswer-content @clickCom='clickCom' @clickZan='clickZan' @clickPlayAudio='clickPlayAudio' @clickShowVideo='clickShowVideo' :playAduioSrc='playAduioSrc' :homeworkType='item.type' :aswerInfo='item' :aswerIndex='index' :isTeacher="userInfo.isTeacher"></clock-aswer-content>
      </div>
      <loading-status-tem :noDataText="'暂无记录'" :noData="studyList.length == 0"></loading-status-tem>
    </div>

    <!-- 评论输入框 -->
    <clock-comment-com :enableLongAudio='enableLongAudio' :comType="comType" :isTeacher='userInfo.isTeacher' :playAduioSrc='playAduioSrc' :showCommentModal='showComInput' :replyName='replyName' :curComId='curComId' :replyId='replyId' :imgData="imgData" @commentSuccess='commentSuccess' @clickPlayAudio='clickPlayAudio' @cleanPlayAudioUrl='cleanPlayAudioUrl'></clock-comment-com>
    <clock-tea-comment-com :teacher="1" :clockInId="clockInId" :enableLongAudio='enableLongAudio' :playAduioSrc='playAduioSrc' :showTeaCommentModal='showTeaCommentModal' :workType='userInfo.type' :resultIndex='resultIndex' :resultInfo='resultInfo' :imgData="imgData" @commentSuccess='commentSuccess' @clickPlayAudio='clickPlayAudio' @clickShowVideo='clickShowVideo'></clock-tea-comment-com>
    <!-- 视频播放器 -->
    <video-popup :showVideo="showVideo" @clickCloseVideo="clickCloseVideo" :videoSrc="currentVideoObj.videoSrc" :m3u8Url="currentVideoObj.m3u8Url"></video-popup>

    <cj-popup v-model="showAiAnswer" round>
      <article class="c-ww570 c-textAlign-l c-mt20 c-bg-white c-br8 c-ph20 c-pt30 c-pb40">
        <!-- <h2 class="c-pb40 c-fs30 c-fw-b">答题卡</h2> -->
        <section v-if="curAiAnswerInfo">
          <clock-aswer-ai :clockInId='clockInId' :examMainId="curAiAnswerInfo.examMainId" :curHwId="curAiAnswerInfo.hwId" :totalNum="curAiAnswerInfo.content" :showAiResutl="showAiAnswer"></clock-aswer-ai>
        </section>
      </article>
    </cj-popup>
    <!-- 修改昵称 -->
    <div v-show="showEditNickName" class="c-pz1002 c-w100 c-h c-pf c-p-l0 c-p-t0 c-flex-row c-flex-center">
      <div class="c-translucent-balck50 c-text-hidden c-pz-1 c-w100 c-h c-pa c-p-l0 c-p-t0" @click="showEditNickName = false;" data-type='cancel'></div>
      <div class="c-ww540 c-bg-white c-flex-column c-pz1 c-br20">
        <div class="c-fs28 c-textAlign-c c-pt50 c-fw-b c-lh c-pb30">修改昵称</div>
        <div class="c-ph30 ">
          <div class="c-w100 c-fs20 c-lh64 c-br10 c-bd1 c-mt10">
            <input type="text" ref="nickName" autofocus="autofocus" maxlength="8" :value="userInfo.nickname" :placeholder="'请输入新昵称'" class="c-w100 c-bd0 c-text-indent20 c-h c-lh48 c-br10 c-fs26" />
          </div>
          <div class="c-hh50 c-lh50 c-fs18 c-textAlign-l c-fc-red"></div>
        </div>
        <footer class="c-fs20 c-flex-row c-fs28 c-bd-t1">
          <div @click="showEditNickName = false;" class="c-hh88 c-flex-row c-flex-center c-flex-grow1 c-w0 c-fc-gray c-bd-r1">取消</div>
          <div @click="editNickName()" class="c-hh88 c-flex-row c-flex-center c-flex-grow1 c-w0 theme-fc">确定</div>
        </footer>
      </div>
    </div>
    <cj-actionsheet v-model="myOperationShow" :item-list="operationMenu" @choose="clickOperationMenu" show-cancel></cj-actionsheet>
  </div>
</template>

<script>
import { utilJs } from "@/utils/common.js";
import clockAswerAi from "@/components/templates/clockIn/clockAswerAi.vue";
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import clockAswerContent from "@/components/templates/clockIn/clockAswerContent.vue";
import clockCommentCom from "@/components/templates/clockIn/clockCommentCom.vue";
import clockTeaCommentCom from "@/components/templates/clockIn/clockTeaCommentCom.vue";
import videoPopup from "@/components/templates/common/videoPopup.vue";
//const clientW = document.documentElement.clientWidth > 640 ? 640 : document.documentElement.clientWidth; //屏幕宽度
//const videoH = (clientW / 320) * 180; //视频高度
let isLoading = false;
let userId = "";
let clockInId = "";
let curComIndex = ""; //当前评论的下标
export default {
  name: "StudyHistory",
  components: {
    clockAswerAi,
    clockAswerContent,
    clockTeaCommentCom,
    clockCommentCom,
    loadingStatusTem,
    videoPopup,
  },
  props: [],
  beforeRouteLeave(to, from, next) {
    //当有评论弹窗的时候，后退就关闭弹窗
    if ((this.showComInput || this.showTeaCommentModal || this.showVideo) && to.path != '/' && to.path != '/homePage/spread/spreadIndex' && to.path != '/member/vip/vipUpNew') {
      let curScollTop = document.documentElement.scrollTop || document.body.scrollTop;
      this.showTeaCommentModal = false;
      this.showComInput = false;
      if (this.showVideo) {
        this.showVideo = false;
      }
      history.pushState(null, null, `${window.location.href.split("#")[0]}#${from.fullPath}`);
      setTimeout(() => {
        window.scrollTo(0, curScollTop);
      });
    } else {
      next();
    }
  },
  data() {
    return {
      theme: localStorage.getItem("colorName")
        ? localStorage.getItem("colorName")
        : "mb5_default",
      userInfo: {
        myNickname: "",
        myUserId: "",
        nickname: "",
        headimgurl: "",
        finishNum: 0,
        zanNum: 0,
        score: 0,
        userId: 0
      },
      typeQueMap: {
        1: '简答题',
        2: '非简答题',
        3: 'AI语音',
        4: '表单',
        5: '非简答题',
      },
      playAduioSrc: "", //播放音频的src
      showVideo: false,
      isMe: true, //是否自己
      showComInput: false, //显示评论输入框
      showTeaCommentModal: false, //显示教师评论输入框
      resultInfo: {},
      resultIndex: -1,
      curComId: "",
      replyId: "",
      replyName: "", //回复人的昵称
      studyList: [],
      showAiAnswer: false,
      curAiAnswerInfo: null,
      imgData: {},
      comType: 1,
      clockInId:0,
      showEditNickName:false,
      currentVideoObj: {},
      myOperationShow: false,
      operationMenu: {},
      operationMenuLength: 0,
      myResultIndex:0,
      curSelectDate: "",
      isDisCheat:0,
      isTraining:'',
      enableLongAudio:0
    };
  },
  created() {
    utilJs.appShare(this);
  },
  mounted() { },
  methods: {
  goStuAnswerResult(info) {
      // let query = {
      //     clockInId: clockInId,
      //     curHwId : this.homeWorkInfo.hwId,
      //     stuHwId:info.hwId,
      //     curSelectDate:this.curSelectDate,
      //     examMainId: info.examMainId,
      //     totalNum:info.type == 3 ? info.aiNum : 0
      //   }
      // console.log(query)
      // return
      if (this.userInfo.myUserId != this.userInfo.userId) {
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/stuShortAnswerResult",
          query: {
            clockInId: clockInId,
            curHwId : info.hwId,
            stuHwId:info.hwId,
            curSelectDate:this.curSelectDate,
            examMainId: info.examMainId,
            totalNum:info.type == 3 ? info.aiNum : 0
          }
        });
      } else {
        if (info.type == 1) {
          this.$routerGo(this, "push", {
            path: "/homePage/clockIn/shortAnswerResult",
            query: {
              clockInId: clockInId,
              curHwId : info.hwId,
              curSelectDate:this.curSelectDate,
              isTraining:this.isTraining,
              workType:this.userInfo.type,
              examMainId: info.examMainId,
            }
          });
        } else if (info.type == 4) {
          this.$routerGo(this, "push", {
            path: "/homePage/clockIn/shortAnswerResult",
            query: {
              clockInId: clockInId,
              curHwId : info.hwId,
              curSelectDate:this.curSelectDate,
              isTraining:this.isTraining,
              workType:this.userInfo.type,
              examMainId: info.examMainId,
            }
          });
        } else if (info.type == 3) {
          this.$routerGo(this, "push", {
            path: "/homePage/clockIn/voiceResult",
            query: {
              curHwId: info.hwId,
              totalNum: info.content,
              curDate: this.curSelectDate,
              examMainId: info.examMainId,
              clockInId: clockInId,
              workType:this.userInfo.type
            }
          });
        } else {
          this.$routerGo(this, "push", {
            path: "/homePage/clockIn/homeWorkResult",
            query: {
              examMainId: info.examMainId,
              isFromDetail: true,
              curDate: this.curSelectDate,
              workType:this.userInfo.type,
              clockInId: clockInId,
              curHwId : info.hwId
            }
          });
        }
      }
    },
    getBaseConfig() {
      let postUrl = `${global.apiurl}signCard/getBaseConfig?signColId=${clockInId}`;
      utilJs.getMethod(postUrl, (res) => {
        this.isDisCheat = res.isDisCheat
        this.enableLongAudio = res.enableLongAudio
      });
    },
    //点击重测
    clickTestAgain(index) {
      if (this.studyList[index].type == 4) {
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/clockForm",
          query: {
            curHwId: this.studyList[index].hwId,
            examMainId: this.studyList[index].examMainId,
            clockId: clockInId,
            curDate: this.curSelectDate,
            workType:this.userInfo.type
          }
        });
        return;
      } else if (this.studyList[index].type == 1) {
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/simpleQue",
          query: {
            curHwId: this.studyList[index].hwId,
            examMainId: this.studyList[index].examMainId,
            clockId: clockInId,
            curDate: this.curSelectDate,
            workType:this.userInfo.type
          }
        });
        return;
      } else if (this.studyList[index].type == 3) {
        //进入AI语音
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/voiceQue",
          query: {
            curHwId: this.studyList[index].hwId,
            clockInId: clockInId,
            curDate: this.curSelectDate,
            isReTest: 1,
            examMainId: this.studyList[index].examMainId,
            workType:this.userInfo.type
          }
        });
        return;
      }
      this.$routerGo(this, "push", {
        path: "/homePage/clockIn/choiceQue",
        query: {
          curHwId: this.studyList[index].hwId,
          curNum: 1,
          isReText: true,
          examMainId: this.studyList[index].examMainId,
          curDate: this.curSelectDate,
          clockId: clockInId,
          workType:this.userInfo.type
        }
      });
    },

    //点击查看解析
    clickLookAswer(index) {
      if (this.studyList[index].type == 1) {
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/simpleQueResult",
          query: {
            curHwId: this.studyList[index].hwId
          }
        });
      } else if (this.studyList[index].type == 3) {
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/voiceResult",
          query: {
            curHwId: this.studyList[index].hwId,
            totalNum: this.studyList[index].content,
            curDate: this.curSelectDate,
            examMainId: this.studyList[index].examMainId,
            clockInId: clockInId,
            workType:this.userInfo.type
          }
        });
      } else {
        this.$routerGo(this, "push", {
          path: "/homePage/clockIn/homeWorkResult",
          query: {
            examMainId: this.studyList[index].examMainId,
            isFromDetail: true,
            curDate: this.curSelectDate,
            workType:this.userInfo.type,
            clockInId: clockInId,
            curHwId : this.studyList[index].hwId
          }
        });
      }
    },
    clickOperationMenu(item, key) {
      if (item.value == 0) {
        this.clickTestAgain(this.myResultIndex)
      }
      if (item.value == 1) {
        this.clickLookAswer(this.myResultIndex)
      }
      if (item.value == 2) {
        this.clickeDelete(this.myResultIndex)
      }
    },
    showOprationSheet(index) {
      this.myResultIndex = index
      console.log(1111111)
      this.myOperationShow = true
    },
    calcOperation(item, index) {
      let temObj = []
      if (item.isDisAgainSign && this.userInfo.myUserId == item.userId) {
        temObj.push({name:'重测', value:0})
      }
      if (item.isAnalyze && item.type == 1) {
        temObj.push({name:'查看解析', value:1})
      }
      if (item.enableDelete == 1) {
        temObj.push({name:'删除', value:2})
      }
      this.operationMenu = temObj
      this.operationMenuLength = Object.keys(this.operationMenu).length
      this.showOprationSheet(index)
    },
    // 方法名：删除考试记录
    // 方法：signCard/deleteExamLog
    // 方式：post
    // 参数：examMainId
    clickeDelete(index) {
      this.$cjConfirm({
        title: '提示',
        message: '删除后无法恢复，确定删除日记?',
        onConfirm:() => {
          utilJs.postMethod(
            global.apiurl + "signCard/deleteExamLog",
            { examMainId: this.studyList[index].examMainId },
            res => {
              this.initData();
              this.getStudyHistoryList();
            },
          );
        }
      })
    },
    editNickName() {
      let value = this.$refs.nickName.value;
      if (value.trim().length > 8) {
        this.$showCjToast({
          text: "昵称长度不得超过8个字符",
          type: 'warn',
        });
        this.showEditNickName = false;
        return
      }
      value = utilJs.checkScriptStr(value)
      let that = this;
      utilJs.postMethod(global.apiurl + 'signCard/setStudentNickName', {
        nickname:value,
        signColId:clockInId
        }, function (res) {
          if (res) {
            that.$showCjToast({
              text: "修改成功",
              type: 'success',
            });
          }
          that.showEditNickName = false;
          that.initData();
          that.getStudyHistoryList();
      });
    },
    ediNinameShow() {
      if (this.userInfo.nickname == this.userInfo.myNickname) {
        this.showEditNickName = true
      }
    },
    showAiAnswerContent(itemInfo) {
      this.curAiAnswerInfo = itemInfo;
      this.showAiAnswer = true;
    },
    cleanPlayAudioUrl() {
      this.playAduioSrc = "";
      document.getElementById("audio").src = this.playAduioSrc;
    },
    //点击显示视频
    clickShowVideo(videoSrc, m3u8Url) {
      this.showVideo = true;
      this.currentVideoObj = {videoSrc, m3u8Url}
    },
    //点击关闭视频
    clickCloseVideo() {
      if (this.showVideo) {
        this.showVideo = false;
      }
    },

    //点击开始播放音频
    clickPlayAudio(audioUrl) {
      let audio = document.getElementById("audio");
      if (this.playAduioSrc == audioUrl) {
        this.playAduioSrc = "";
        document.getElementById("audio").src = this.playAduioSrc;
        return;
      }
      this.playAduioSrc = audioUrl;

      //返回mp3则用audio播放
      if (this.playAduioSrc && this.playAduioSrc.includes("http")) {
        document.getElementById("audio").src = this.playAduioSrc;
        audio.play();
      }
    },

    //点赞
    clickZan(index) {
      if (isLoading) {
        return;
      }
      isLoading = true;
      let zanType = this.studyList[index].hasZan == 1 ? 2 : 1;
      let examMainId = this.studyList[index].examMainId;

      utilJs.getMethod(
        `${global.apiurl}signCard/clickZan/${examMainId}?zanType=${zanType}`,
        res => {
          isLoading = false;
          this.$showCjToast({
            text: zanType == 1 ? '点赞成功' : '取消点赞',
            type: "success",
          });
          this.$set(this.studyList[index], "hasZan", zanType == 2 ? 0 : 1);
          if (zanType == 1) {
            this.studyList[index].zanMan.push({
              nickname: this.userInfo.myNickname
            });
          } else {
            let zanArr = this.studyList[index].zanMan.filter(item => {
              return item.nickname != this.userInfo.myNickname;
            });
            this.$set(this.studyList[index], "zanMan", zanArr);
          }
        },
        failRes => {
          isLoading = false;
        }
      );
    },

    //点击评论
    clickCom(index, cIndex, commentId, myAswerIndex, isTeacher) {
      if (cIndex == -1 && (this.userInfo.isTeacher == 1 || this.userInfo.isTeacher == 2) && isTeacher) {
        curComIndex = index;
        // let resInfo = {
        //   accuracy: this.studyList[index].accuracy,
        //   audioArr: this.studyList[index].audioArr,
        //   commentArr: this.studyList[index].commentArr,
        //   content: this.studyList[index].content,
        //   examMainId: this.studyList[index].examMainId,
        //   examType: this.studyList[index].examType,
        //   hasZan: this.studyList[index].hasZan,
        //   hwId: this.studyList[index].hwId,
        //   imgArr: this.studyList[index].imgArr,
        //   name: this.studyList[index].name,
        //   rank: this.studyList[index].rank,
        //   reorder: this.studyList[index].reorder,
        //   showMoreText: this.studyList[index].showMoreText,
        //   startDay: this.studyList[index].startDay,
        //   totalpoins: this.studyList[index].totalpoins,
        //   type: this.studyList[index].type,
        //   videoArr: this.studyList[index].videoArr,
        //   zanMan: this.studyList[index].zanMan,
        //   finishNum: this.userInfo.finishNum,
        //   headimgurl: this.userInfo.headimgurl,
        //   nickname: this.userInfo.nickname,
        // }
        this.studyList[index].finishNum = this.userInfo.finishNum
        this.studyList[index].headimgurl = this.userInfo.headimgurl
       this.studyList[index].nickname = this.userInfo.nickname
        this.resultInfo = this.studyList[index];
        this.resultIndex = myAswerIndex;
        this.showTeaCommentModal = true;
        this.playAduioSrc = "";
        document.getElementById("audio").src = this.playAduioSrc;
        return;
      }
      let examMainId = "";
      //点击别人的评论
      if (cIndex != -1) {
        this.comType = this.studyList[index].commentArr[cIndex].type
      }
      examMainId = this.studyList[index].examMainId;
      this.replyId = cIndex == -1 ? "" : this.studyList[index].commentArr[cIndex].userId;
      this.replyName = cIndex == -1 ? "" : this.studyList[index].commentArr[cIndex].nickname;

      curComIndex = index;
      this.curComId = examMainId;
      this.showComInput = true;
    },

    //评论成功
    commentSuccess(comData, type) {
      let content = {
        type: comData.type,
        content: comData.content,
        nickname: this.userInfo.myNickname,
        replyName: this.replyName,
        replyUserId: this.replyId,
        userId: this.userInfo.myUserId,
        imgArr: comData.imgArr,
        audioArr: comData.audioArr,
        videoArr: comData.videoArr || [],
        headimgurl:comData.headimgurl,
        commentId:comData.commentId,
        encodeUserId:localStorage.getItem("userId"),
        createdAt:comData.commentTime,
      };
      if (this.userInfo.isTeacher == 1 || this.userInfo.isTeacher == 2) {
        this.$set(this.studyList[curComIndex], "isHot", comData.isHot);
        this.$set(this.studyList[curComIndex], "rank", comData.rank);
        this.$set(this.studyList[curComIndex], "createdAt", comData.commentTime);
      }
      this.studyList[curComIndex].commentArr.push(content);
      this.showComInput = false;
      this.showTeaCommentModal = false;
      this.replyName = "";
      this.replyId = "";
      if (type == 1) {
        this.initData();
        this.getStudyHistoryList();
      }
    },

    //监听音频播放结束执行的内容
    playAudioEnd() {
      this.playAduioSrc = "";
      document.getElementById("audio").src = this.playAduioSrc;
    },

    //获取学习记录
    getStudyHistoryList() {
      utilJs.getMethod(
        global.apiurl +
        "signCard/learnRecordHead/" +
        userId +
        "?signColId=" +
        clockInId,
        res => {
          this.studyList = res.homeWorkList;
          let info = {
            isTeacher: res.isTeacher,
            myNickname: res.myNickname,
            myUserId: res.myUserId,
            nickname: res.nickname,
            headimgurl: res.headimgurl,
            zanNum: res.zanNum || 0,
            score: Math.floor(res.score) || 0,
            userId: res.userId,
            finishNum: res.finishNum || 0,
            type: res.type,
          };
          this.userInfo = info;
        }
      );
    },

    initData() {
      this.curSelectDate = this.$route.query.curSelectDate || "";
      curComIndex = ""; //当前评论的下标
      this.replyId = ""; //回复人的ID
      this.curComId = ""; //当前评论ID
      this.showVideo = false;
      this.showComInput = false; //显示评论输入框
      this.showTeaCommentModal = false;
      this.showAiAnswer = false;
      this.playAduioSrc = ""; //播放音频的src
      this.replyName = ""; //回复人的昵称
      this.studyList = [];
      this.userInfo = {
        myNickname: "",
        myUserId: "",
        nickname: "",
        headimgurl: "",
        zanNum: 0,
        finishNum: 0,
        score: 0,
        userId: 0
      };
    },
    //分享
    wechatShare: function () {
      let title = window.localStorage.getItem("companyName");
      let shareImg = window.localStorage.getItem("shareLogo");
      let shareDesc = window.localStorage.getItem("shareDesc");
      let shareUrl = `${window.location.href.split("#")[0]}#${this.$route.path}?refereeId=${localStorage.getItem("userId")}`
      let shareIndexData = {
        shareUrl,
        title,
        shareImg,
        shareDesc,
      };
      let shareData = localStorage.getItem("homeWorkShare") ? JSON.parse(localStorage.getItem("homeWorkShare")) : shareIndexData;
      utilJs.wechatConfig(
        shareData.shareUrl,
        shareData.title,
        shareData.shareImg,
        shareData.shareDesc,
        function () { },
        true
      );
    },
    //手机端分享
    appShare: function () {
      let title = window.localStorage.getItem("companyName");
      let shareImg = window.localStorage.getItem("shareLogo");
      let shareDesc = window.localStorage.getItem("shareDesc");
      let shareUrl = `${window.location.href.split("#")[0]}#${this.$route.path}?refereeId=${localStorage.getItem("userId")}`
      let shareIndexData = {
        shareUrl,
        title,
        shareImg,
        shareDesc,
      };
      let shareData = localStorage.getItem("homeWorkShare") ? JSON.parse(localStorage.getItem("homeWorkShare")) : shareIndexData;
      utilJs.appShareTrue(
        shareData.title,
        shareData.shareImg,
        shareData.shareUrl,
        shareData.shareDesc
      );
    }
  },
  activated() {
    setDocumentTitle("学习记录");// eslint-disable-line
    if (document.getElementById("audio")) {
      document.getElementById("audio").src = '';
    }
    userId = this.$route.query.userId;
    clockInId = this.$route.query.clockId;
    this.clockInId = this.$route.query.clockId || 0
    this.isMe = this.$route.query.isMe;
    this.isTraining = this.$route.query.isTraining || ''
    this.currentVideoObj = {}
    this.initData();
    this.getStudyHistoryList();
    this.getBaseConfig()
    this.wechatShare();
    //获取阿里云签名，除了微信浏览器以外
    if (!utilJs.isWeiXin()) {
      utilJs.getAliSign(`${global.apiurl}imageSign`, res => {
        this.imgData = res;
      });
    }
    //解决ios播放没声音
    try {
      if (typeof WeixinJSBridge == "undefined") {
        if (document.addEventListener) {
          document.addEventListener('WeixinJSBridgeReady', function () {
            document.getElementById("audio").play();
          }, false);
        } else if (document.attachEvent) {
          document.attachEvent('WeixinJSBridgeReady', function () {
            document.getElementById("audio").play();
          });
          document.attachEvent('onWeixinJSBridgeReady', function () {
            document.getElementById("audio").play();
          });
        }
        WeixinJSBridge.invoke("getNetworkType", {}, function (e) {// eslint-disable-line
          // 在这里拿到 e.err_msg, 这里面就包含了所有的网络类型
          document.getElementById("audio").play();
          console.log("WeixinJSBridgeWeixinJSBridgeWeixinJSBridgeWeixinJSBridge");
        });
      }
    } catch (error) {
      // continue regardless of error
    }
  },
  deactivated() {
    if (document.getElementById("audio")) {
      document.getElementById("audio").src = '';
    }
  }
};
</script>
<style scoped>
.box-analyze {
  height: 0.8rem;
  /* background: rgba(255, 120, 0, 0.1); */
  border-radius: 0.4rem 0 0 0.4rem;
}
.c-text-indent20{text-indent: 0.5rem;}
.top-bg {
  /* background: url('../../../assets/i/wap/clockIn/study_record.png') no-repeat center; */
  background-size: 100% 100%;
  width: 100%;
  height: 6.25rem;
  margin-bottom: 2.85rem;
}
.top-block {
  bottom: -2.08rem;
}
.title-line {
  position: relative;
}
.title-line:after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: .15rem;
  height: .55rem;
  border-radius: 2px;
  background-color: var(--mb7color);
}
.type-bg {
  margin-right: .25rem;
  border-radius: 0.1rem;
  padding:0.125rem 0.25rem;
  font-size: .4rem;
}
.top-header {
  border: 2px solid rgba(255,255,255);
}
.onlyIcon{
  left: -0.26rem;
  top: -0.4rem;
}
</style>
